﻿@{
ViewBag.Title = "Form";
Layout = "~/Views/Shared/_Form.cshtml";
}
<form id="form1">
    <div style="margin-top: 10px; margin-left: 10px; margin-right: 10px;">
        <ul class="nav nav-tabs">
            <li class="active"><a href="#">基本信息</a></li>
            @*<li ><a href="#">扩展信息</a></li>*@
        </ul>
        <div style="padding-top: 20px; margin-right: 30px;">
            <table class="form">
                <tr>
                    <th class="formTitle">用户名</th>
                    <td class="formValue">
                        <input id="UserName" name="UserName" type="text" class="form-control required" placeholder="请输入用户名" />
                    </td>
                    <th class="formTitle">密码</th>
                    <td class="formValue">
                        <input id="Password" name="Password" type="password" class="form-control required" placeholder="请输入密码" />
                    </td>
                </tr>
                <tr>
                    <th class="formTitle">公司</th>
                    <td class="formValue">
                        <select id="CompanyId" name="CompanyId" class="form-control required"></select>
                    </td>
                    <th class="formTitle">部门</th>
                    <td class="formValue">
                        <select id="DepartmentId" name="DepartmentId" class="form-control required">
                            <option value="">==请选择==</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <th class="formTitle">岗位</th>
                    <td class="formValue">
                        <select id="PositionId" name="PositionId" class="form-control required">
                            <option value="">==请选择==</option>
                        </select>
                    </td>
                    <th class="formTitle">昵称</th>
                    <td class="formValue">
                        <input id="NickName" name="NickName" type="text" class="form-control required" placeholder="请输入姓名" />
                    </td>
                </tr>
                <tr>
                    <th class="formTitle">姓名</th>
                    <td class="formValue">
                        <input id="RealName" name="RealName" type="text" class="form-control required" placeholder="请输入姓名" />
                    </td>
                    <th class="formTitle">性别</th>
                    <td class="formValue">
                        <select id="Gender" name="Gender" class="form-control required">
                            <option value="1">男</option>
                            <option value="2">女</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <th class="formTitle">手机</th>
                    <td class="formValue">
                        <input id="MobilePhone" name="MobilePhone" type="text" class="form-control" />
                    </td>
                    <th class="formTitle">生日</th>
                    <td class="formValue">
                        <input id="Birthday" name="Birthday" type="text" class="form-control input-wdatepicker" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})" />
                    </td>
                </tr>
                <tr>
                    <th class="formTitle">微信</th>
                    <td class="formValue">
                        <input id="WeChat" name="WeChat" type="text" class="form-control" />
                    </td>
                    <th class="formTitle">邮箱</th>
                    <td class="formValue">
                        <input id="Email" name="Email" type="text" class="form-control" />
                    </td>
                </tr>
                <tr>
                    <th class="formTitle">类型</th>
                    <td class="formValue">
                        <select id="ObjectType" name="ObjectType" class="form-control">
                            <option value="1">普通用户</option>
                            <option value="2">系统管理员</option>
                        </select>
                    </td>
                    <th class="formTitle">允许登录</th>
                    <td class="formValue">
                        <select id="EnabledMark" name="EnabledMark" class="form-control">
                            <option value="true">是</option>
                            <option value="false">否</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <th class="formTitle">角色</th>
                    <td class="formValue" colspan="3">
                        <select id="RoleIds" name="RoleIds" class="form-control required"></select>
                    </td>
                </tr>
                <tr>
                    <th class="formTitle" valign="top" style="padding-top: 5px;">
                        备注
                    </th>
                    <td class="formValue" colspan="3">
                        <textarea id="Description" name="Description" class="form-control" style="height: 60px;"></textarea>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</form>
<script>
    var keyValue = $.request("keyValue");
    $(function () {
        initControl();
        if (!!keyValue) {
            $.ajax({
                url: "/SystemManage/User/GetFormJson",
                data: { keyValue: keyValue },
                dataType: "json",
                async: false,
                success: function (data) {
                    $("#form1").formSerialize(data);
                    $("#UserName").attr('disabled', 'disabled');
                    $("#Password").val("******").attr('disabled', 'disabled');
                    $("#RoleIds").val(data.RoleIds.split(',')).trigger("change");
                }
            });
        }
    });
    function initControl() {
        $("#Gender").bindSelect()
        $("#ObjectType").bindSelect()
        $("#EnabledMark").bindSelect()
        $("#CompanyId").bindSelect({
            url: "/SystemManage/Organize/GetTreeSelectJson"
        });
        $("#DepartmentId").bindSelect({
            url: "/SystemManage/Organize/GetTreeSelectJson",
        });
        $("#PositionId").bindSelect({
            url: "/SystemManage/Position/GetGridJson",
            id: "Id",
            text: "FullName"
        });
        $.ajax({
            type: 'get',
            url: "/SystemManage/Role/GetSelectJson",
            dataType: 'json',
            async: false,
            success: function (data) {
                var results = [];
                $.each(data, function (idx, obj) {
                    var rslt = {};
                    rslt.id = obj.Id;
                    rslt.text = obj.FullName;
                    results.push(rslt);
                });
                $('#RoleIds').select2({
                    multiple: true,
                    data: results
                });
            }
        });

        $("#UserName").blur(function () {     
            if (validUserNameFormat()) { 
                vaildUserNameExists();
            }
        });
    }
    function submitForm() {
        if (!!keyValue) { 
            if (!$('#form1').formValid()) {
                return false;
            }
        }
        else{ 
            if (!$('#form1').formValid() || !validUserNameFormat()) {
                return false;
            }
        }
        var postData = $("#form1").formSerialize();
        postData["roleIds"] = $('#RoleIds').val();
        $.submitForm({
            url: "/SystemManage/User/SubmitForm?keyValue=" + keyValue,
            param: postData,
            success: function () {
                $.currentWindow().$("#gridList").trigger("reloadGrid");
            }
        })
    }
    function validUserNameFormat() {
        var username = $("#UserName").val();
        if (username == "" || username == null) {
            $.modalMsg("用户名不能为空，请填写用户名。","error");
            return false;
        }
        else if (/^\d.*$/.test(username)) { 
            $.modalMsg("您输入的用户名“" + username + "”格式不正确，用户名不能以数字开头。", "error");
            return false;
        }
        else if (! /^.{6,20}$/.test(username)) {
            $.modalMsg("您输入的用户名“" + username + "”字符长度有误，合法长度为6-20个字符。", "error");
            return false;
        }
        else if (! /^[\w_]*$/.test(username)) {
            $.modalMsg("您输入的用户名“" + username + "”含有非法字符，用户名只能包含_,英文字母，数字。", "error");
            return false;
        }
        else if (! /^([a-z]|[A-Z])[\w_]{5,19}$/.test(username)) {
            $.modalMsg("您输入的用户名“" + username + "”格式不正确，用户名只能包含_,英文字母，数字。", "error");
            return false;
        }
        else { 
            return true;
        }
    }
    function vaildUserNameExists() { 
        $.ajax({
            type: 'get',
            url: "/SystemManage/User/VaildUserNameExists",
            dataType: 'json',
            async: false,
            data: { username: $("#UserName").val() },
            success: function (result) {
                if (result.state == 'error') {
                    $.modalMsg(result.message, "error");
                    setTimeout(function () {
                        //$('#UserName').val('');
                        $('#UserName').focus();
                    }, 500)
                }
            }
        });
    }
</script>